<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/taobao.css">
</head>

<body>
    <div class="box">
        <!-- 头部导航栏 -->
        <div class="top">
            <div class="wrap">
                <ul class="top-left left">
                    <li><select name="diqu" id="">
                        <option value="">中国大陆</option>
                        <option value="">全球</option>
                        <option value="">中国台湾</option>
                    </select></li>
                    <li><a href="" id="spe1">亲，请登录</a></li>
                    <li><a href="">免费注册</a></li>
                    <li><a href="">手机淘宝</a></li>
                </ul>
                <ul class="top-right right">
                    <li><a href="" class="menu-btm">我的淘宝</a></li>
                    <li><b></b><a href="" class="menu-btm">购物车<span>0</span></a></li>
                    <li><a href="" class="menu-btm">收藏夹</a></li>
                    <li><a href="">商品分类</a></li>
                    <li><a href="">免费开店</a></li>
                    <li class="line"></li>
                    <li><a href="" class="menu-btm">千牛卖家中心</a></li>
                    <li><a href="" class="menu-btm">联系客服</a></li>
                    <li><a href="" class="menu-btm">网站导航</a></li>
                </ul>
                <div class="clearfix"></div>
            </div>
        </div>
        <div class="article">
            <!-- 搜索栏 -->
            <div class="search">
                <div class="pic"><img src="./img/14785.png" alt=""></div>
                <div class="pa">
                    <div class="page">
                        <span>宝贝</span>
                        <input type="text" name="" class="sear" placeholder="运动t恤夏季" id="">
                        <button class="btn">搜索</button>
                    </div>
                    <p>新款连衣裙 四件套 潮流T恤 时尚女鞋 短裤 半身裙 男士外套 墙纸 行车记录仪 新款男鞋 耳机 时尚女包 沙发</p>
                </div>
                <div class="pic"><img src="./img/二维码.png" alt=""></div>
                <div class="clearfix"></div>
            </div>
            <!-- 导航 -->
            <div class="nav-box">
                <ul class="nav-ul">
                    <li class="all">
                        <a href='' class="txt-1">主题市场</a>
                        <div class="all-list">
                            <ul>
                                <li class="nav1"><a href="">女装</a>/<a href="">内衣</a>/<a href="">家居</a><i></i></li>
                                <li class="nav2"><a href="">女鞋</a>/<a href="">男鞋</a>/<a href="">箱包</a><i></i></li>
                                <li class="nav3"><a href="">母婴</a>/<a href="">童装</a>/<a href="">玩具</a><i></i></li>
                                <li class="nav4"><a href="">男装</a>/<a href="">户外运动</a><i></i></li>
                                <li class="nav5"><a href="">美妆</a>/<a href="">个人护理</a>/<a href="">洗护</a><i></i></li>
                                <li class="nav6"><a href="">女装</a>/<a href="">内衣</a>/<a href="">中老年</a><i></i></li>
                                <li class="nav7"><a href="">鞋靴</a>/<a href="">箱包</a>/<a href="">腕表配饰</a><i></i></li>
                                <li class="nav8"><a href="">男装</a>/<a href="">户外</a>/<a href="">户外健身</a><i></i></li>
                                <li class="nav9"><a href="">手机</a>/<a href="">数码</a>/<a href="">电脑办公</a><i></i></li>
                                <li class="nav10"><a href="">小家电</a>/<a href="">大家电</a>/<a href="">汽车</a><i></i></li>
                                <li class="nav11"><a href="">保健滋补</a>/<a href="">医药</a>/<a href="">成人</a><i></i></li>
                                <li class="nav12"><a href="">卡</a>/<a href="">旅游</a>/<a href="">充值</a><i></i></li>
                                <li class="nav13"><a href="">母婴</a>/<a href="">童装</a>/<a href="">玩具</a><i></i></li>
                                <li class="nav14"><a href="">母婴</a>/<a href="">童装</a>/<a href="">玩具</a><i></i></li>
                                <li class="nav15"><a href="">母婴</a>/<a href="">童装</a>/<a href="">玩具</a><i></i></li>
                            </ul>
                        </div>
                    </li>
                    <li class="li-1"><a href="" class="light">天猫</a></li>
                    <li class="li-1"><a href="" class="light">聚划算</a></li>
                    <li class="li-1"><a href="">天猫超市</a></li>
                    <li class="li-1">|</li>
                    <li class="li-1"><a href="">司法拍卖</a></li>
                    <li class="li-1"><a href="">飞猪旅行</a></li>
                    <li class="li-1"><a href="">天天特卖</a></li>
                    <li class="li-1"><a href="">淘小铺</a></li>
                    <div class="clearfix"></div>
                </ul>
                <div class="clearfix"></div>

            </div>
            <!-- 中间 -->
            <div class="banner">
                <div class="pic1">
                    <img src="./img/TB183NQapLM8KJjSZFBSutJHVXa.jpg" alt="">
                    <div>
                        <img src="./img/tianmao.png" alt="">
                        <span>理想生活上天猫</span>
                    </div>
                    <img src="./img/TB183NQapLM8KJjSZFBSutJHVXa.jpg" alt="">
                </div>
                <div class="pic2">
                    <img src="./img/lou.webp" alt="">
                    <img src="./img/5zhe.jpg" alt="">
                </div>
                <div class="pic3">
                    <img src="./img/tao1.png" alt="">
                    <div>
                        <button>登陆</button>
                        <button>注册</button>
                        <button>开店</button>
                    </div>
                    <img style="width: 350px;" src="./img/1471477.jpg" alt="">
                    <ul class="ul-01">
                        <li><a href="">公告</a></li>
                        <li><a href="">规则</a></li>
                        <li><a href="">安全</a></li>
                        <li><a href="">公益</a></li>
                        <li><a href="">千牛</a></li>
                    </ul>
                    <div class="clearfix"></div>
                    <p>严禁借庆祝建党100周年进行商业营销的公告</p>
                    <div class="banner-r-btm">
                        <ul>
                            <li class="bn-li-1"><span></span>充话费</li>
                            <li class="bn-li-2"><span></span>旅行</li>
                            <li class="bn-li-3"><span></span>车险</li>
                            <li class="bn-li-4"><span></span>游戏</li>
                            <li class="bn-li-5"><span></span>彩票</li>
                            <li class="bn-li-6"><span></span>电影</li>
                            <li class="bn-li-7"><span></span>酒店</li>
                            <li class="bn-li-8"><span></span>理财</li>
                        </ul>
                        <div class="clearfix"></div>
                    </div>
                    <div>
                        <h3>阿里APP <span>更多 ></span></h3>
                    </div>
                    <div>
                        <ul class="ul-02">
                            <li><img src="./img/tao.png" alt=""></li>
                            <li><img src="./img/tian.png" alt=""></li>
                            <li><img src="./img/zhi.png" alt=""></li>
                            <li><img src="./img/ding.png" alt=""></li>
                            <li><img src="./img/111.png" alt=""></li>
                        </ul>




                    </div>
                </div>
                <div class="clearfix"></div>

            </div>
            <!-- 图片 -->
            <div class="picture">
                <h2>有好货
                    <img src="./img/a0.png" alt="">
                </h2>
                <ul class="p-ul-1">
                    <li>
                        <img src="./img/t1.webp" alt="">
                        <p><a href="">Pure Cashmere 保暖针织帽</a></p>
                        <p>这款针织帽风格休闲可爱，帽口...</p>
                    </li>
                    <li>
                        <img src="./img/t2.webp" alt="">
                        <p><a href="">Pure Cashmere 保暖针织帽</a></p>
                        <p>这款针织帽风格休闲可爱，帽口...</p>
                    </li>
                    <li>
                        <img src="./img/t3.webp" alt="">
                        <p><a href="">Pure Cashmere 保暖针织帽</a></p>
                        <p>这款针织帽风格休闲可爱，帽口...</p>
                    </li>
                    <li>
                        <img src="./img/t4.webp" alt="">
                        <p><a href="">Pure Cashmere 保暖针织帽</a></p>
                        <p>这款针织帽风格休闲可爱，帽口...</p>
                    </li>
                    <li>
                        <img src="./img/t5.webp" alt="">
                        <p><a href="">Pure Cashmere 保暖针织帽</a></p>
                        <p>这款针织帽风格休闲可爱，帽口...</p>
                    </li>
                </ul>
                <div class="clearfix"></div>
                <ul class="p-ul-2">
                    <li><img src="./img/a1.jpg" alt=""></li>
                    <li><img src="./img/a2.jpg" alt=""></li>
                    <li><img src="./img/a3.jpg" alt=""></li>
                    <div class="clearfix"></div>
                </ul>
                <div class="clearfix"></div>
            </div>
        </div>
    </div>
</body>

</html>